<template>
    <div class="brand">
        <h4>品牌制造商直供</h4>
        <ul>
            
            <li v-for="item in brandList" :key="item.id">
                <img :src="item.pic_url" alt="" Lazyload >
                <p class="box1">{{ item.name }}</p>
                <p class="price">{{ item.floor_price | formatMoney }}</p>
            </li>
        </ul>
    </div>
</template>
<script>
export default {
    name: '',
    props: ['brandList'],
    data() {
        return {}
    },
    components: {
    },
    watch: {},
    methods: {
    },
    beforeCreate() { },
    created() { },
    beforeMount() { },
    mounted() { },
    beforeUpdate() { },
    updated() { },
    beforeDestroy() { },
    destroyed() { },
};
</script>
<style scoped lang="less">
.brand ul{
 display: flex;
 flex-wrap: wrap;
 justify-content:space-between;
 
 li{
    width: 48%;
    position: relative;
    margin-bottom: 5px;
    
    img{
        width: 100%;
        display: block;
    }
    .box1{
        font-size: 16px;
        position: absolute;
        top: 15px;
        left: 10px;
        
    }
    .price{
        position: absolute;
        font-size: 15px;
        color: crimson;
        top: 40px; 
        left: 20px;
    }
 }

}
h4{
    display: block;
    height: 50px;
    text-align: center;
    line-height: 50px;
    margin-top: 10px;
}
</style>